import React, {Component} from 'react';
import {Image} from 'react-native'
import PhotoView from 'react-native-photo-view';
import {isAndroid} from "../../configs/platform";


/**
 * 宽度固定，高度自适应图片
 */
export default class ScaledPhotoView extends Component {
    constructor(props) {
        super(props)
        this.state = {
            source: {uri: this.props.uri},
            width: 0,
            height: 0,
        }
    }

    componentWillMount() {
        Image.getSize(this.props.uri, (width, height) => {
            if (this.props.width && !this.props.height) {
                this.setState({width: this.props.width, height: height * (this.props.width / width)})
            } else if (!this.props.width && this.props.height) {
                this.setState({width: width * (this.props.height / height), height: this.props.height})
            } else {
                this.setState({width: width, height: height})
            }
        }, (error) => {
            console.log("ScaledImage:componentWillMount:Image.getSize failed with error: ", error)
        })
    }

    render() {
        return (<PhotoView
            source={this.state.source}
            minimumZoomScale={1}
            maximumZoomScale={5}
            androidScaleType="fitCenter"
            style={[this.props.style, {height: this.state.height, width: this.state.width}]}
            resizeMode={isAndroid() ? "" : "contain"}
        />)

    }
}